import {  useRoutes } from "react-router-dom";
import { useEffect } from "react";
import { useAppSelector } from "@/hooks/useReduxHook";
import { routes } from "./routes";
import LazyLoad from "@/utils/LazyLoad";

export default function Router() {
  const apiRoutes = useAppSelector((state) => state.menu.routes);

  useEffect(() => {

    routes[0].children?.push(...apiRoutes)
    routes[0].children![0].element = LazyLoad('/NotFound')  
    console.log(routes);
     
  }, [apiRoutes]);
  const element = useRoutes(routes);
  return <>{element}</>;
}
